<template>
  <!--    面包屑导航-->
    <div style="margin-top: 20px;margin-left: 20px">
        <el-breadcrumb separator="/">
            <el-breadcrumb-item ><b>我的课堂</b></el-breadcrumb-item>
            <el-breadcrumb-item>课程成绩</el-breadcrumb-item>
        </el-breadcrumb>
    </div>
  <!-- 表格 -->
    <div class="table-container">
        <el-table :data="tableData" stripe style="width: 58%;border: #989988 solid 2px;">
            <el-table-column prop="courseNumber" label="课程号" width="190" />
            <el-table-column prop="course" label="课程名" width="190" />
            <el-table-column prop="grades" label="分数"  width="186"/>
            <el-table-column prop="credits" label="学分"  width="186"/>
        </el-table>
    </div>
</template>

<script setup>
import {onMounted, ref} from "vue";
import axios from "axios";
import request8090 from "../../../../utils/request8090.js";
/*获取成绩信息*/
const tableData = ref([])
const courseScores=()=>{
    request8090({
        url:'/student/getselfscores',
        method:'GET',
        params:{sNumber:sessionStorage.getItem("snumber")},
    }).then(res=>{
        if (200 == res.data.errorCode){
            tableData.value=res.data.data;
        }
    })
}
onMounted(()=>{
    courseScores()
})
</script>

<style scoped>
.table-container {
    display: flex;
    justify-content: center; /* 水平居中 */
    margin-top: 20px; /* 可选，为了美观添加一些顶部边距 */
}
</style>